html,
body {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ccc
}

.cont {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('../../api/get_img.php');
    z-index: -1
}

.box {
    width: 100%;
    height: 100%;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center
}

.cont1 {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.container {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .5s;
    background: rgba(255, 255, 255, 0.3)
}

.container:hover {
    background: rgba(255, 255, 255, 1)
}

.mu-demo-form {
    width: 80%;
    height: 50%;
    padding: 15px 10
}

.mu-demo-form .mu-form-item:last-child {
    margin: 0
}

@media screen and (max-width:830px) {
    .container {
        background: rgba(255, 255, 255, 1)
    }

    .cont {
        width: 80%;
        min-height: 100%
    }

    .container:hover {
        background: rgba(255, 255, 255, 1)
    }

    #btns {
        position: absolute;
        top: -75px;
        right: 0
    }
}